{% extends "master.jinja2" %}
{% block main %}
<div class="container">
    <div class="row">
        <div class="panel panel-primary">
            <div class="panel-heading center-block">购物车</div>
            <div class="panel-body" id="shoping_cart_body">
            {% if carts %}
                <table class="table table-bordered table-striped" id="shoping_cart_table">
                    <tr>
                        <td>编号</td>
                        <td>名称</td>
                        <td>售价</td>
                        <td>数量</td>
                        <td>小计</td>
                        <td>操作</td>
                    </tr>
                    {% for cart in carts -%}
                    <tr id="shoping_tr_1">
                        <td>{{cart.id}}</td>
                        <td>{{cart.items[0].name}}</td>
                        <td id="shoping_price_1" data-price="{{cart.items[0].price}}">￥{{cart.items[0].price}}</td>
                        <td width="130">
                                <div class="input-group">
                                    <span class="input-group-btn"><button class="btn sub_num btn-default" data-id="{{cart.id}}">-</button></span>
                                    <input type="text" value="1" id="shoping_cart_number_1" readonly aria-describedby="basic-addon1" class="form-control" >
                                    <span class="input-group-btn">
                                        <button class="btn add_num btn-default" data-id="1">+</button>
                                    </span>
                                </div>
                           </td>
                        <td>￥<span class="total" id="shoping_total_1">{{cart.items[0].price}}</span></td>
                        <td><a href="javascript:void(0)" class="delete_shoping" data-id="{{cart.id}}">删除</a></td>
                    </tr>
                    {% endfor %}
                </table>
                <p class="pull-right">
                    <a href="index.html">继续购物</a>|
                    <a href="javascript:void(0)" id="empty_shoping">清空购物车</a>|
                    共计：<strong class="text-danger" id="total_num"></strong>元
                </p>
                <!-- Usage as a class -->
                <div class="clearfix"></div>
                <p class="pull-right">
                    <a class="btn btn-primary" href="#">结算</a>
                </p>
                <!-- Usage as a class -->
                <div class="clearfix"></div>
                {% else %}
                <h2 class="text-center text-info">购物车为空，<a href="{{request.route_url('home')}}">请继续购物</a></h2>
                {% endif %}
            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="{{request.static_url('myproject:static/js/shoping_cart.js')}}"></script>
{% endblock %}